<template>
  <div>
    <a-button type="primary" :disabled="true"
      >{{ props.text }}({{ time }}s)</a-button
    >
  </div>
</template>

<script lang="ts" setup>
import { defineProps, ref, defineEmits } from "vue";

const emits = defineEmits(["changeShowCountDown"]);
const props = defineProps(["time", "text"]);
const time = ref<number>(props.time);

const interval = window.setInterval(() => {
  time.value--;
}, 1000);

const timer = setTimeout(() => {
  emits("changeShowCountDown", false);
  clearInterval(interval);
  clearTimeout(timer);
}, props.time * 1000);
</script>
